<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%--
Created by IntelliJ IDEA.
User: CHJYPC
Date: 2021/6/1
Time: 23:34
To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" %>
<html>
<head>
    <title>导入学生成绩</title>
    <link type="text/css" rel="Stylesheet" href="${requestScope.rootPath}resources/css/importDataScore.css"/>
    <script src="${requestScope.rootPath}resources/js/importDataPlain/jquery.min.js"></script>
    <style>
        * {
            margin: 0;
            padding: 0;
        }

        main {
            position: relative;
            width: 100%;
            height: 100%;
        }

        #leftExcel {
            position: absolute;
            width: 16%;
            background-color: #BBBBBB;
            height: 100%;
            min-height: 800px;
        }

        #rightScore {
            position: absolute;
            left: 16%;
            width: 84%;
            min-height: 800px;
            background-color: #F0DFC8;
            height: 100%;
        }

        .bg {
            display: none;
            position: absolute;
            width: 100%;
            height: 100%;
            background-color: black;
            z-index: 1001;
            -moz-opacity: 0.8;
            opacity: .80;
            filter: alpha(opacity=80);
            top: 0;
            left: -25%;
        }

        .update_div {
            display: none;
            position: absolute;
            top: 20%;
            left: 20%;
            width: 20%;
            height: 40%;
            background-color: white;
            z-index: 1002;
            overflow: auto;
            text-align: center;
            padding: 80px;
        }

        table {
            border-collapse: collapse;
            border-spacing: 0;

        }

        table, th, td {
            border: 1px silver solid;
        }

        table.mainTable {
            font-family: verdana, arial, sans-serif;
            font-size: 15px;
            color: #333333;
            border-width: 1px;
            border-color: #999999;
            border-collapse: collapse;
        }

        table.mainTable th {
            background: #b5cfd2;
            border-width: 1px;
            padding: 4px;
            border-style: solid;
            border-color: #999999;
        }

        table.mainTable td {
            background: #dcddc0;
            border-width: 1px;
            padding: 8px;
            border-style: solid;
            border-color: #999999;
            text-align: center;
        }
    </style>
    <script>
        function deleteScore(id) {
            $(function () {
                $.ajax({
                    url: 'deleteScore?score_id=' + id,
                    async:true,
                    success: function () {
                        window.location.reload();
                    }
                })
            })
        }

        function updateScore(id, stuNo, name, score, courseName) {
            document.getElementById("idUpdate").value = id;
            document.getElementById("stuNoUpdate").value = stuNo;
            document.getElementById("nameUpdate").value = name;
            document.getElementById("scoreUpdate").value = score;
            document.getElementById("courseNameUpdate").value = courseName;
            ShowDiv('MyDiv', 'fade')
        }

        //弹出隐藏层
        function ShowDiv(show_div, bg_div) {
            document.getElementById(show_div).style.display = 'block';
            document.getElementById(bg_div).style.display = 'block';
            var bgdiv = document.getElementById(bg_div);
            bgdiv.style.width = document.scrollWidth;
            $("#" + bg_div).height($(document).height());
        }

        //关闭弹出层
        function CloseDiv(show_div, bg_div) {
            document.getElementById(show_div).style.display = 'none';
            document.getElementById(bg_div).style.display = 'none';
        }
    </script>
</head>
<body>
<main>
    <div id="leftExcel">
        <form enctype="multipart/form-data" action="upload" method="post">
            <h2 style="margin-bottom: 0;margin-top: 0">选择一个文件:</h2>
            <input type="file" name="uploadFile" class="btn-two yellow"/><br>
            <input type="submit" value="上传学生成绩文件" class="btn-3d blue"/>
            <c:if test="${!empty requestScope.errorMes}">
                <label>${requestScope.errorMes}</label>
            </c:if>
        </form>

        <div>
            <form action="importDataScoreServlet" method="get">
                <div>
                    <c:if test="${empty requestScope.file}">
                        <label>当前无成绩文件</label>
                    </c:if>
                    <c:if test="${!empty requestScope.file}">
                        <table class="mainTable">
                            <thead>
                            <tr>
                                <td>已上传文件列表</td>
                            </tr>
                            </thead>
                                <%--                        <h2 style="margin-bottom: 0;margin-top: 0"></h2>--%>
                            <tbody>
                            <c:forEach items="${requestScope.file}" var="s">
                                <tr>
                                    <td>
                                        <input type="checkbox" id="${s}" name="checkbox" value="${s}" form="form1">
                                        <label class="label" for="${s}">${s}
                                        </label>
                                    </td>
                                </tr>
                            </c:forEach></tbody>
                        </table>
                    </c:if>
                </div>
            </form>
            <form action="deleteFile" method="post" id="form1">
                <div>
                    <input type="submit" value="删除学生成绩文件" class="btn-3d blue" style="margin-top: 0">
                </div>
            </form>
        </div>

    </div>
    <div id="rightScore">
        <form action="search" method="post">
            <div id="scanner">
                <LABEL for="name">姓名</LABEL><input id="name" name="name" type="text">
                <label for="stu">学号</label><input id="stu" name="stu" type="text">
                <input type="submit" value="搜索">
            </div>
        </form>
        <c:if test="${!empty requestScope.scoreView}">
            <div>
                <table class="mainTable">
                    <thead>
                    <tr>
                        <th>序号</th>
                        <th>学期</th>
                        <th>学号</th>
                        <th>姓名</th>
                        <th>专业</th>
                        <th>年级</th>
                        <th>班级</th>
                        <th>课程代码</th>
                        <th>课号</th>
                        <th>课程名称</th>
                        <th>成绩</th>
                        <th>学分</th>
                        <th>考试类别</th>
                        <th>成绩类别</th>
                        <th>课程性质</th>
                        <th>操作</th>
                    </tr>
                    </thead>
                    <tbody>
                    <c:forEach items="${requestScope.scoreView}" var="sv">
                        <tr>
                            <td>${sv.rowNum} </td>
                            <td>${sv.course_term} </td>
                            <td>${sv.stu_no} </td>
                            <td>${sv.stu_name} </td>
                            <td>${sv.major_name} </td>
                            <td>${sv.grade} </td>
                            <td>${sv.clazz} </td>
                            <td>${sv.course_code} </td>
                            <td>${sv.course_id} </td>
                            <td>${sv.course_name} </td>
                            <td>${sv.score} </td>
                            <td>${sv.credit} </td>
                            <td>${sv.test_type} </td>
                            <td>${sv.score_type} </td>
                            <td>${sv.course_type} </td>
                            <td><a href="javascript:void(0)"
                                   onclick="updateScore(${sv.score_id},${sv.stu_no},'${sv.stu_name}','${sv.score}','${sv.course_name}')"
                                   style="margin-right: 5px;">修改</a>
                                <a href="javascript:void(0)" onclick="deleteScore(${sv.score_id})">删除</a>
                            </td>
                        </tr>
                    </c:forEach>
                    </tbody>
                </table>
            </div>
            <div>
                <a href="searchLast?pageNow=${requestScope.pageNow}">上一页</a>
                <a href="searchNext?pageNow=${requestScope.pageNow}">下一页</a>
                <input type="number" id="setPage" name="setPage" value="${requestScope.pageNow}" form="form2"
                       style="width: 1cm;margin-left: 10px;margin-right: 5px;">
                <label for="setPage">共${requestScope.allPage}页</label>
                <form id="form2" action="searchPage" method="post"></form>
            </div>
        </c:if>
        <div id="fade" class="bg" style="width: 100%">
        </div>
        <div id="MyDiv" class="update_div">
            <form id="updateForm" action="updateScore" method="post">
                <input id="idUpdate" type="hidden" name="idUpdate" value="${requestScope.idUpdate}"><br>
                <label for="stuNoUpdate">学号</label>
                <input id="stuNoUpdate" type="text" readonly name="stuNoUpdate" value=""><br>
                <label for="nameUpdate">姓名</label>
                <input id="nameUpdate" type="text" readonly name="nameUpdate" value=""><br>
                <label for="courseNameUpdate">课程</label>
                <input id="courseNameUpdate" type="text" readonly name="courseNameUpdate" value=""><br>
                <label for="scoreUpdate">成绩</label>
                <input id="scoreUpdate" type="text" name="scoreUpdate" value=""><br>l
            </form>
            <button style="font-size: 16px;" onclick="CloseDiv('MyDiv','fade')">取消</button>
            <input type="submit" value="修改" style="font-size: 16px;" form="updateForm">
        </div>
    </div>

</main>
</body>
</html>
